<div style="display:flex; flex-direction: column;">

    <div style="width: 100%">
        <nz-table #nzTable [nzDataSource]="activities" [nzPageSize]="5" nzShowSizeChanger>
            <tbody nz-tbody>
            <tr nz-tbody-tr *ngFor="let activity of nzTable.data;let i=index">
                <td>
                    <nz-card>
                        <div style="display: flex;">
                            <a class="mc-bold-title">{{activity.actName}}</a>
                        </div>
                        <div style="padding-top:1rem; ">基本信息:</div>
                        <div style="display: flex; ">
                            <div class="mc-title">
                                活动类型:
                            </div>
                            <div class="mc-content">{{activity.actType}}</div>
                        </div>
                        <div style="display: flex;">
                            <div class="mc-title">
                                资　　金:
                            </div>
                            <div class="mc-content">{{activity.actMoney}}</div>
                        </div>
                        <div style="display: flex;">
                            <div class="mc-title">
                                物　　资:
                            </div>
                            <div class="mc-content">{{activity.actMater}}</div>
                        </div>
                        <div style="display: flex;">
                            <div class="mc-title">
                                起止时间:
                            </div>
                            <div class="mc-content">
                                {{activity.actBegDate}}~{{activity.actEndDate}}
                            </div>
                        </div>
                        <div style="display: flex;">
                            <div class="mc-title">
                                活动地点:
                            </div>
                            <div class="mc-content">{{activity.actPlace}}</div>
                        </div>
                        <div style="display: flex;">
                            <div class="mc-title">
                                参与人数:
                            </div>
                            <div class="mc-content">{{activity.actNum}}</div>
                        </div>
                        <div style="display: flex;">
                            <div class="mc-title">
                                宣传方式:
                            </div>
                            <div class="mc-content">{{activity.actPropaWay}}</div>
                        </div>
                        <div style="display: flex;">
                            <div class="mc-title">
                                活动反馈:
                            </div>
                            <div class="mc-content">{{activity.actFeedback}}</div>
                        </div>
                        <div class="mc-detail-container">
                            <div class="mc-bold-title">
                                赞助详情:
                            </div>
                            <div id="act-detail{{i}}" class="mc-detail"
                                 [innerHtml]="activity.actDetail | html">

                            </div>
                        </div>

                        <div style="display:flex; padding-top: 2px; padding-left: 70%;margin-top: 3rem">
                            <button nz-button style="color: #3a87ad" (click)="updateConfirm(activity,'1')">审核通过
                            </button>
                            <button nz-button style="margin-left: 1rem;color: #b94a48; "
                                    (click)="updateConfirm(activity,'2')">拒绝
                            </button>
                        </div>

                    </nz-card>
                </td>
            </tr>
            </tbody>
        </nz-table>

    </div>

</div>
